$( document ).ready( function() {

    var fields = [
        {
            element : $('input#Nombre'),
            message : 'Por favor ingrese su nombre',
            default : 'Nombre:',
            required : true
        }, {
            element : $('input#Apellido'),
            message : 'Por favor ingrese su apellido',
            default : 'Apellido:',
            required : true
        }, {
            element : $('input#Mail'),
            default : 'Mail:',
            required : false
        }, {
            element : $('input#Telefono'),
            default : 'Tel\u00E9fono:',
            required : false
        }, {
            element : $('textarea#Mensaje'),
            message : 'Por favor ingrese el mensaje',
            default : 'Mensaje:',
            required : true
        }
    ];

    prepareStatusPanel();
    for( var i = 0; i < fields.length; i++ ) fields[i].element.checkDefault();

    $('input#Enviar').click( function(ev) {
        var ok = true;
        for( var i = 0; i < fields.length; i++ ) {
            if( fields[i].required && ! isValid(fields[i]) ) {
                showError( fields[i].message, fields[i].element );
                ev.preventDefault();
                ok = false;
                break;
            }
        }

        if( ok ) {
            var v_mail     = ( fields[2].element.val().trim() != fields[2].default ? fields[2].element.val().trim() : '' );
            var v_telefono = ( fields[3].element.val().trim() != fields[3].default ? fields[3].element.val().trim() : '' );

            var obj = {
                nombre   : $('input#Nombre').val().trim(),
                apellido : $('input#Apellido').val().trim(),
                mail     : v_mail,
                telefono : v_telefono,
                mensaje  : $('textarea#Mensaje').val().trim()
            };

            $.ajax({
                url  : 'ajax/send_message.php',
                type : 'POST',
                data : obj,
            }).done( function(response) {
                $('img#Spinner').hide();
                if( response == 1 ) {
                    showSuccess('Su mensaje ha sido enviado y ser\u00E1 contestado a la brevedad');
                    for( var i = 0; i < fields.length; i++ ) fields[i].element.val( fields[i].default );
                } else {
                    showFailure('El mensaje no pudo ser enviado, por favor int\u00E9ntelo de nuevo en otro momento');
                }
            });
        }
    });
});

function prepareStatusPanel() {
    $('div#Error img').click( function() {
        $('div#Error').fadeOut( 750 );
    });
    $('div#Success img').click( function() {
        $('div#Success').dequeue().fadeOut( 750 );
    });
    $('div#Failure img').click( function() {
        $('div#Failure').dequeue().fadeOut( 750 );
    });
}

$.fn.checkDefault = function() {
    return $( this ).each( function() {
        var element = $( this );
        var def     = element.val();

        element.focus( function() {
            if( element.val().trim() == def ) element.val('');
        }).blur( function() {
            if( element.val().trim() == '' ) element.val( def );
        });
    });
}

function isValid( item ) {
    var value = item.element.val().trim();
    return ( (value != '') && (value != item.default) );
}

function showError( message, e ) {
    $('div#Success').hide();
    $('div#Failure').hide();
    $('div#Error span').text( message );
    $('div#Error').fadeIn( 750 );
    e.focus();
}

function showSuccess( message ) {
    $('div#Error').hide();
    $('div#Failure').hide();
    $('div#Success span').text( message );
    $('div#Success').fadeIn( 750 ).delay( 5000 ).fadeOut( 750 );
}

function showFailure( message ) {
    $('div#Error').hide();
    $('div#Success').hide();
    $('div#Failure span').text( message );
    $('div#Failure').fadeIn( 750 ).delay( 5000 ).fadeOut( 750 );
}

$( document ).ajaxStart(function() {
    $('img#Spinner').show();
});